<template>
  <div v-for="router in routeDate" :key="router.path">
    <div v-if="router.meta.hidden">
      <div v-if="router.children">
        <el-sub-menu :index="router.path">
          <template #title>
            <el-icon><document /></el-icon>
            {{ router.meta.title }}
          </template>
          <mymenu
            :routeDate="router.children"
            :isCollapse="isCollapse"
          ></mymenu>
        </el-sub-menu>
      </div>
      <div v-else>
        <el-menu-item :index="router.path">
          <el-icon><component :is="router.meta.myicon" /></el-icon>
          <template #title :v-show="!isCollapse">
            {{ router.meta.title }}
          </template>
        </el-menu-item>
      </div>
    </div>
  </div>
</template>

<script>
import mymenu from "./mymenu.vue";
export default {
  components: {
    mymenu,
  },
  setup() {},
  props: {
    routeDate: { type: Array },
    isCollapse: { type: Boolean, default: true },
  },
};
</script>
